
import { _decorator, Component, Button, Label, Node, Prefab, instantiate, Widget, CCInteger, Layout } from 'cc';

import { Direction } from "./SlotEnum";
import { RoolClomn } from "./RoolClomn";
import { SpineClomn } from './SpineClomn';

const { ccclass, property } = _decorator;
// 定义一个类型来表示回调函数
type StopPinCallback = (result: any) => void;

@ccclass('SlotHorizontalView')
export class SlotHorizontalView extends Component {

    @property({ type: Node, tooltip: "开奖动画的node" })
    glows: Node = null;

    @property({ type: Prefab, tooltip: '复用的每一列的数据' })
    slotClomn: Prefab = null;

    @property({ type: CCInteger, tooltip: '控制有多少列' })
    countColmn: number = 3; // 列数

    /** 滚轴组每一列的数据 */
    private reels: Node[] = [];
    /** 是否正在滚动 */
    public spinning = false;

    /// 生命周期函数预加载
    protected onLoad(): void {
        // this.createMachine();
    }

    /** 创建初始布局添加子节点 */
    createMachine(): void {
        this.node.removeAllChildren();
        this.reels = [];
        if (this.countColmn == null) {
            this.countColmn = 3;
        }
        for (let i = 0; i < this.countColmn; i++) {
            const newReel = instantiate(this.slotClomn);
            this.node.addChild(newReel);
            this.reels[i] = newReel;
            /// 获取到每一列的数据
            const reel = newReel.getComponent(SpineClomn);
            /// 打乱每一列的图片
            reel.shuffle();
        }
        ///  更新该组件的对齐状态，因为它有Layout组件，是水平布局的
        // 检查 Widget 组件是否存在
        const layoutComponent = this.node.getComponent(Layout);
        if (layoutComponent) {
            layoutComponent.updateLayout(); // 更新布局
        } else {
            console.error("Layout 组件未找到，请确保它已附加到节点上。");
        }

    }

    /** 开始滚动 */
    beginSpin(): void {
        this.spinning = true;
        /// 暂停开奖动画
        // this.disableGlow();
        for (let i = 0; i < this.countColmn; i++) {
            ///获取指定类型的节点
            const theClomn = this.reels[i].getComponent(SpineClomn);
            // theClomn.spinDirection = (i % 2) ? Direction.Down : Direction.Up;
            theClomn.spinDirection = Direction.Down;
            theClomn.doSpin(0.03 * i);
        }
    }

    /** 停止滚动 */
    stopPin(result: any, callback: StopPinCallback): void {
        console.log("停止结果", result);
        setTimeout(() => {
            this.spinning = false;
            callback(true);
            /// 播放中奖动画
            this.enableGlow(result);
        }, 2500);
        // 每个 reel（滚轴）设置一个随机的延迟
        const randomOffset = Math.random() / 2;
        for (let i = 0; i < this.countColmn; i++) {
            const spinDelay = (i < 2 + randomOffset) ? i / 4 : randomOffset * (i - 2) + i / 4;
            const theReel = this.reels[i].getComponent(SpineClomn);
            setTimeout(() => {
                const resutArr = result.reels[i];
                console.log("停止结果resutArr长度", result.length);
                theReel.readyStop(resutArr);
            }, spinDelay * 1000);
        }
    }

    /** 播放中奖动画 */
    enableGlow(result: any) {
        // for (const lineIndex of result.equalLines) {
        //     const line: Node = this.glows.children[lineIndex];
        //     for (const glow of line.children) {
        //         // const skel = glow.getComponent(sp.Skeleton);
        //         // skel.animation = "loop";
        //     }
        // }
    }

    /** 关闭开奖动画*/
    disableGlow() {
        // for (const line of this.glows.children) {
        //     for (const glow of line.children) {
        // const skel = glow.getComponent(sp.Skeleton);
        // skel.animation = null;
        //     }
        // }
    }
}